<template>
  <div style="background: #F7F7F7;">
    <div style="background: #fff;padding-top: 0.2rem;overflow: hidden;padding-bottom: 0.6rem" v-if="chenload">
      <div style="margin-top: 0.3rem;">
        <div class="top">
          <p>订单编码:</p>
          <p>{{data.order_sn}}</p>
        </div>
        <p class="p1"></p>
      </div>
      <div style="margin-top: 0.3rem;">
        <div class="top">
          <p>交易名称:</p>
          <p style="width: 4.3rem;text-align: right; overflow: hidden;white-space: nowrap;
    text-overflow:ellipsis;/*超出部分文字以...显示*/">{{data.good_name}}</p>
        </div>
        <p class="p1"></p>
      </div>
      <div style="margin-top: 0.3rem;">
        <div class="top">
          <p>消费方式:</p>
          <p v-if="data.payment==2||data.payment=='2'">赛思币</p>
          <p v-else>微信</p>
        </div>
        <p class="p1"></p>
      </div>
      <div style="margin-top: 0.3rem;">
        <div class="top">
          <p>时间:</p>
          <p>{{data.addtime}}</p>
        </div>
        <p class="p1"></p>
      </div>
      <div style="margin-top: 0.3rem;">
        <div class="top">
          <p>实付:</p>
          <p v-if="data.payment==2||data.payment=='2'">{{data.amount}}</p>
          <p v-else>{{data.amount}}元</p>
        </div>
      </div>
    </div>
		<div class="loadmore" v-else>
			<img src="../../../src/assets/img/load.gif" alt="">
		</div>

  </div>
</template>

<script>
  export default {
    name: "Xfmingxi",
		data(){
			return{
				data:'',
				id:'',
				chenload:false
			}
		},
		methods:{
			
		},
		mounted(){
			this.sdk.getJSSDK('','',this.$store.state.url);	
			var that = this;
			that.id = that.$route.query.id;
			that.axios.get(that.$store.state.url + "User/feeRecordInfo",{
				 params:{
					fee_id:that.id,
				 }
			}).then(res=>{
				that.chenload=true;
				if (res.data.errcode == 0||res.data.errcode == '0'){
					// this.money = res.data.data.money
						that.data = res.data.data;
				}
			})
		}
  }
</script>

<style scoped>
  .top{
    width: 92%;
    margin: auto;
		
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .top p:nth-child(1){
    font-size:0.3rem;
    color:rgba(51,51,51,1)
  }
  .top p:nth-child(2){
    font-size:0.26rem;
    color:rgba(153,153,153,1);
  }
  .p1{
    width: 92%;
    margin: auto;
    height: 0.02rem;
    background: #EDEDED;
    margin-top: 0.3rem;
  }
</style>
